* {
    margin: 0;
    padding: 0;
}
.fl {
    float: left;
}
.fr {
    float: right;
}
.inline-block {
    display: inline-block;
}
.clearfix {
    clear: both;
}
a {
    text-decoration: none;
}
li {
    list-style: none;
}
img {display: block;}
.w1200 {width: 12rem;margin: 0 auto;}
.w1600 {width: 16rem;margin: 0 auto;}
.relative {position: relative;}
.absolute {position: absolute;}
/* header */
.header {height: 1.6rem;width: 100%;padding: 0 0.5rem;box-sizing: border-box;overflow: hidden;background: #0086DC;}
.header h1 {position: relative;height: 100%;line-height: 1.6rem;}
.logo {position: absolute;top: 50%;left: 0;transform: translateY(-50%);width: 1.5rem;}
h1 span {margin-left: 1.6rem;color: #fff; font-size: 0.4rem;}
.login {position: absolute;bottom: 0; right: 0;text-align:right;color: #fff;line-height: 0.5rem;}
.border {display: inline-block;vertical-align: middle;width: 1px; height: 0.16rem;background: #fff;margin: 0 5px 2px;}
.search-box {width: 4rem; margin-top: 0.3rem;background: #fff;position: relative;}
.search-box input {height: 0.5rem;width: 100%; padding-left: 10px;box-sizing: border-box;border: none;outline: none;}
.search-box img {position: absolute;top: 50%;transform: translateY(-50%);right: 10px;}
/* navs */
.navs {height: 0.6rem; line-height: 0.6rem;background:#0177C3;color: #fff;font-size: 0.22rem;}
.nav {display: inline-block;width: 1.5rem;height: 100%;vertical-align: top;text-align: center;border-right: 1px solid #fff;}
.nav.active {color: #333;}
.banner img {height: 6rem;width: 100%;}
/* content */
.content {padding-bottom: 1rem;overflow: hidden;padding-top: 0.7rem; text-align: center;}
.content-top {text-align: left;height: 0.56rem;line-height: 0.56rem;background: #BEE5EB;color: #6D6B6F;font-size: 14px;padding-left: 0.2rem;box-sizing: border-box;}
.content-input input{ width: 1.8rem; margin: 10px; height: 0.3rem; padding-left: 10px; border-radius: 20px; outline: none;border: none;}
.content-input span {display: inline-block; box-sizing: border-box; background: #007BFF; color: #fff;padding:0 20px; margin-right: 0.1rem; box-sizing: border-box; height: 70%;}
.box {color:#787878;font-size:0.3rem;position: relative;}
.box-inner {width: 100%;height: 100%;overflow: hidden;}
.content-body {margin-top: 0.2rem;overflow: hidden;box-sizing: border-box; border-top: 1px solid #C1C1C1; border-left: 1px solid #C1C1C1;}
.c-item {float: left; width: 20%; text-align: center; padding: 20px 10px 10px; box-sizing: border-box;border-bottom: 1px solid #C1C1C1; border-right: 1px solid #C1C1C1;}
.c-item.active .buy { background: #E72121; color:#fff;}
.c-item .item-img {display: inline-block;width: 1.74rem; height: 1.74rem; }
.c-item .item-title { text-align: left; color: #323232; font-size: 16px; margin-top: 20px;}
.c-item .item-price { color: #E72121; font-size: 20px; margin: 10px 0; text-align: left;}
.c-item p { text-align: left;}
.item-icon {display: inline-block;width: 10px; margin-right: 10px;}
.c-item .store, .c-item .sale { font-size: 14px; color: #7B7B7B;}
.c-item .sale { margin-top: 10px; line-height: 30px;}
.c-item .buy {width: 0.96rem; line-height: 30px; height: 30px; border: 1px solid #7B7B7B; text-align: center; border-radius: 20px; }
.pagetion {display: inline-block; margin: 40px auto 0; border: 1px solid #C1C1C1; font-size: 0;}
.pagetion div {display: inline-block; line-height: 30px; padding: 0 10px; font-size: 16px;}
.pagetion div:nth-child(1) { border-right: 1px solid #C1C1C1;}
.pagetion div.num {border-right: 1px solid #C1C1C1;}
.pagetion div.active { color: #007BFF;}
.pagetion div.num.active {background: #007BFF; color: #fff;}
/* .box-inner {position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);} */
.inner-left {display: inline-block;width: 40%;height: 100%;position: relative;}
.inner-left img {position: absolute; top: 50%; right:0; transform: translateY(-50%);}
.inner-right {display: inline-block;width: 50%;height: 100%;position: relative;}
.inner-right-content {position: absolute; top: 50%; left: 10px; transform: translateY(-50%);font-size: 0.24rem;}
.box-title {color: #323232; font-size: 0.3rem;font-weight: 700;}
.content .box .box-inner .inner-right .more {position: absolute; right: 20px; bottom: 40px; width: 0.3rem;height: 0.3rem;}
/* footer */
.footer{background: #005992;position: relative;padding: 50px;box-sizing: border-box;color: #fff;}
.footer li {line-height: 40px;}
.footer li:first-child {font-size: 24px; line-height: 50px;}
.footer .qrcode {position: absolute;top:0; right: 50px;}
.footer .qrcode img {margin-bottom: 30px;}
.footer a {color: #fff; margin: 0 10px;}
/* copyright */
.copyright {color: #fff;font-size: 14px;text-align: center; border-top: 1px solid #dfdfdf;line-height: 40px;background: #005992;}
